<template>
  <el-main>
    <div style="text-align: left">
      <span>员工管理系统</span>
      <br />
      <span>手机号:</span>
      <el-input placeholder="手机号" v-model="input2" style="width:200px;margin-right:20px"></el-input>
      <span>员工姓名:</span>
      <el-input placeholder="员工姓名" v-model="input1" style="width:200px;margin-right:20px"></el-input>
      <span>员工部门:</span>
      <el-input placeholder="员工部门" v-model="input3" style="width:200px;margin-right:20px"></el-input>


      <!-- <span>学生性别:</span> -->
      <!-- 下拉框选择器 -->
      <!-- <el-select v-model="value" placeholder="请选择员工性别">
        <el-option
          v-for="item in options"
          :key="item.value"
          :label="item.label"
          :value="item.value"
        >
        </el-option>
      </el-select> -->
      <!--登陆-->
      <el-button type="info" icon="el-icon-search" @click="select">查询</el-button>
      <!--登陆-->
      <el-button type="success" icon="el-icon-edit">添加</el-button>
    </div>
    <router-view></router-view>
    <el-table :data="tableData">
      <el-table-column prop="sex" label="性别" width="140">
      </el-table-column>
      <el-table-column prop="phoneNum" label="手机号" width="140">
      </el-table-column>
      <el-table-column prop="employeeName" label="姓名" width="120">
      </el-table-column>
      <el-table-column prop="age" label="年龄" width="140">
      </el-table-column>
      <el-table-column prop="departmentEmployees" label="部门" width="140">
      </el-table-column>
      <el-table-column prop="email" label="邮箱" width="140">
      </el-table-column>
      <el-table-column prop="salary" label="入职薪资" width="140">
      </el-table-column>
      <template slot-scope="">
        <el-table-column prop="createDate" label="创建时间" width="400">
          <template slot-scope="scope">
            <span v-html="getYMDHMS(scope.row.createDate)"></span>
          </template>
        </el-table-column>
      </template>

      <el-table-column prop="cz" label="修改" width="140">
        <el-button type="warning">修改</el-button>
      </el-table-column>
      <el-table-column prop="cz" label="删除" width="140">
        <el-button type="danger">删除</el-button>
      </el-table-column>
    </el-table>
  </el-main>
</template>

<script>
export default {
  name: "Yuangong",
  created:function(){
    this.select();
  },
  data() {
    //下拉框选择器
    return {
      input2 : "",
      input1 : "",
      input3 : "",
      tableData: [],
      options: [
        // {
        //   value: "选项1",
        //   value1: "选项1",
        //   label: "男",
        // },
        // {
        //   value: "选项2",
        //   value1: "选项2",
        //   label: "女",
        // },
      ],
      value: "",
    };
  },
  props: {},
  methods: {
      select: function (){
        var that = this;
        this.$axios.post("/yuangong/queryData",{
          departmentEmployees : this.input3,
          phoneNum : this.input2,
          employeeName : this.input1,
        })
        .then(function(response){
          console.log(response);
          that.tableData=response.data.data;
        })
        .catch(function (error) { });
      },
      //时间格式转换
    getYMDHMS: function (timestamp) {
      let time = new Date(timestamp);
      let year = time.getFullYear();
      let month = time.getMonth() + 1;
      let date = time.getDate();
      let hours = time.getHours();
      let minute = time.getMinutes();
      let second = time.getSeconds();

      if (month < 10) {
        month = "0" + month;
      }
      if (date < 10) {
        date = "0" + date;
      }
      if (hours < 10) {
        hours = "0" + hours;
      }
      if (minute < 10) {
        minute = "0" + minute;
      }
      if (second < 10) {
        second = "0" + second;
      }return (
        year +
        "-" +
        month +
        "-" +
        date +
        " " +
        hours +
        ":" +
        minute +
        ":" +
        second
      );
    },
  },
};
</script>

<style>

</style>
